<template>
	<view class="page list px12 py10">
		<view class="bor r40 bgff search flex flexC px14 py8 mb10">
			<image class="mr10" src="/static/img/icon/search.png" mode="aspectFill"></image>
			<input  @input="searchInput($event)" type="text" placeholder="请输入姓名/手机号搜索"/>
		</view>
		<view v-for="(item,index) in list" class="bgff r4 flex flexC p12 mb10">
			<view class="mr10 flex1">
				<view><text class="mr12">{{item.name}}</text><text>{{item.phone}}</text></view>
				<view class="mt6 fs12">{{item.province}}{{item.city}}{{item.area}}{{item.detail}}</view>
			</view>
			<image class="edit" @click="edit(item)" src="/static/img/icon/edit.png" mode="aspectFill"></image>
		</view>
		<button @click="addAdress" class="bgff0 w212 r40 mt25 fs16 py14">新增收货地址</button>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[],
				keyword:""
			}
		},
		onShow() {
			this.getList();
		},
		methods: {
			
			searchInput(e){
				this.keyword = e.target.value;
				console.info(e.target.value);
				this.list = [];
				this.getList();
			},
			
			getList(){
				
				let that = this;
				let param = {
					keyword:this.keyword
				};
				this.$api.addressList(param).then(res => {
					
					if(res.code == 1){
						that.list = res.data;
					}else{
						
					}
					
				})
			},
			edit(item){
			
				uni.navigateTo({
					url:'./edit?item='+JSON.stringify(item)
				})
			},
			
			addAdress(){
				uni.navigateTo({
					url:'./add'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
.list {
	.edit{width: 40upx;height: 40upx;}
	.search {
		image {width: 24upx;height: 24upx;}
	}
	.w212 {width: 424upx; position: fixed;bottom: 40upx; left: calc(50% - 212upx);}
}
</style>
